<template>
  <div class="pageWrapper">
    <common-header />
    <van-tabs v-if="ready" v-model="active" color="#1B68EB" sticky title-inactive-color="#CCCCCC" title-active-color="#1F1F1F" :offset-top="isDD ? 0 : '1.33333rem'" :line-width="58" :line-height="2">
      <van-tab title="未处理">
        <tab-item ref="tabItem0" :year.sync="year" :isYear="isYear" :type="0" :levelList="levelList" />
      </van-tab>
      <van-tab title="处理中">
        <tab-item ref="tabItem1" :year.sync="year" :isYear="isYear" :type="1" :levelList="levelList" />
      </van-tab>
      <van-tab title="处理完毕">
        <tab-item ref="tabItem2" :year.sync="year" :isYear="isYear" :type="2" :levelList="levelList" />
      </van-tab>
    </van-tabs>
  </div>
</template>

<script>
import tabItem from "./components/tab-item.vue";
import { getDictionaryByType } from "@/api/common";
import { mapState } from "vuex";
export default {
  name: "ObjectionHandle",
  components: {
    tabItem
  },
  beforeRouteEnter(to, from, next) {
    if (from.name == "Year" || from.name == "Normal" || !from.name) {
      next(vm => {
        vm.isYear = to.query.type == "year" ? 1 : 0;
        vm.active = 0;
        vm.getLevel();
        if (vm.ready) {
          vm.refresh();
        }
      });
    } else {
      next(vm => {
        if (vm.ready) {
          vm.refresh();
        }
      });
    }
  },
  data() {
    return {
      ready: false,
      isYear: "",
      active: 0,
      levelList: {},
      year: new Date().getFullYear()
    };
  },
  watch: {
    active() {
      this.refresh();
    }
  },
  computed: {
    ...mapState({
      isDD: state => state.user.is_dd
    })
  },
  methods: {
    getLevel() {
      let type = this.isYear == 1 ? "yearAssess" : "quarterAssess";
      this.levelList = {};
      getDictionaryByType(type).then(res => {
        res.data.forEach(ele => {
          this.$set(this.levelList, ele.dictValue, ele.dictLabel);
        });
        this.ready = true;
      });
    },
    refresh() {
      this.$refs["tabItem" + this.active] && this.$refs["tabItem" + this.active].refresh();
    }
  }
};
</script>

<style scoped lang="scss"></style>
